<template>
  <v-card>
    <v-card-text class="pa-0">
      <v-container class="pa-0">
        <div class="layout row ma-0">
          <div class="sm6 xs6 flex text-sm-center py-3" :color="color">
            <div class="headline">{{ title|showMoneyFilter }}</div>
            <span class="caption">{{ subTitle }}</span>
          </div>
          <div class="sm6 xs6 flex text-sm-center py-3 white--text" :class="color">
            <div class="headline">{{ leftTitle|showMoneyFilter }}</div>
            <span class="caption">{{ leftSubTitle }}</span>
          </div>
        </div>
      </v-container>
    </v-card-text>
  </v-card>
</template>

<script>
export default {
  props: {
    icon: String,
    title: Number,
    subTitle: String,
    leftTitle: Number,
    leftSubTitle: String,
    color: String
  }
};
</script>
